<template>
  <baidu-map class="map" :center="center" :zoom="zoom" @ready="handler">
    <bm-geolocation anchor="BMAP_ANCHOR_BOTTOM_RIGHT" :showAddressBar="true" :autoLocation="true"></bm-geolocation>
  </baidu-map>
</template>
<script>
import BaiduMap from 'vue-baidu-map/components/map/Map.vue'
import BmGeolocation from 'vue-baidu-map/components/controls/Geolocation.vue'
export default {
  data() {
    return {
      center: { lng: 0, lat: 0 },
      zoom: 3,
    }
  },
  components: {
    BaiduMap,
    BmGeolocation,
  },
  methods: {
    handler({ BMap, map }) {
      console.log(BMap, map)
      this.center.lng = 116.404
      this.center.lat = 39.915
      this.zoom = 15
    },
  },
}
</script>
<style lang="scss" scoped>
.map {
  width: 100%;
  height: 500px;

  ::deep .anchorBL {
    display: none;
  }
}
</style>
